<template>
  <el-dialog title="" :visible.sync="onekeydialog" width="80%" class="task-content" append-to-body @close="close1">
      <span>
          <h2 class="titleblue">任务派发</h2>
          <div class="contant">
            <el-form ref="form" :model="sendTask" label-width="80px">
              <el-row class="checkgroup" :gutter="10">
                <el-form-item label="分配">
                  <el-col :span="6" class="task-tree">
                    <div class="grid-content">
                      <el-tree :data="data2" show-checkbox accordion node-key="id" ref="tree" highlight-current
                               :props="defaultProps" :check-strictly="true" :default-checked-keys="defaultTree"
                               :default-expanded-keys="defaultTree" @check="handleCheckChange">
                      </el-tree>
                    </div>
                  </el-col>
                  <el-col :span="16" class="">
                    <div class="grid-content tree-cont">
                      <el-row>
                        <el-col :span="8" v-for="(item,index) in treeList" :key='index'>
                          <span>{{item.name}}</span>
                        </el-col>
                      </el-row>
                    </div>
                  </el-col>
                </el-form-item>
              </el-row>
              <el-row class="checkgroup" :gutter="10">
                <el-form-item label="抄送">
                  <el-col :span="4" v-if="Zero.length!=0">
                    <div class="grid-content groupli copylist">
                      <p>局领导</p>
                      <el-checkbox v-model="checkZero" @change="nodeChange('zeroTree', 'Zero')" class="allchck">全选
                      </el-checkbox>
                      <el-tree
                        :data="Zero"
                        show-checkbox
                        node-key="id"
                        @check-change="treeChange('zeroTree')"
                        ref="zeroTree"
                        highlight-current
                        :props="defaultProps"
                        accordion>
                      </el-tree>
                    </div>
                  </el-col>
                  <el-col :span="4" v-if="One.length!=0">
                    <div class="grid-content groupli copylist">
                      <p>业务部门</p>
                      <el-checkbox v-model="checkOne" @change="nodeChange('oneTree', 'One')" class="allchck">全选
                      </el-checkbox>
                      <el-tree
                        :data="One"
                        show-checkbox
                        node-key="id"
                        @check-change="treeChange('oneTree')"
                        ref="oneTree"
                        highlight-current
                        :props="defaultProps"
                        accordion>
                      </el-tree>
                    </div>
                  </el-col>
                  <el-col :span="4" v-if="Two.length!=0">
                    <div class="grid-content groupli copylist">
                      <p>行政部门</p>
                      <el-checkbox v-model="checkTwo" @change="nodeChange('twoTree', 'Two')" class="allchck">全选
                      </el-checkbox>
                      <el-tree
                        :data="Two"
                        show-checkbox
                        node-key="id"
                        @check-change="treeChange('twoTree')"
                        ref="twoTree"
                        highlight-current
                        :props="defaultProps"
                        accordion>
                      </el-tree>
                    </div>
                  </el-col>
                  <el-col :span="4" v-if="Three.length!=0">
                    <div class="grid-content groupli copylist">
                      <p>海事处</p>
                      <el-checkbox v-model="checkThree" @change="nodeChange('threeTree', 'Three')" class="allchck">全选
                      </el-checkbox>
                      <el-tree :data="Three" show-checkbox node-key="id" @check-change="treeChange('threeTree')"
                               ref="threeTree" highlight-current :props="defaultProps" accordion>
                      </el-tree>
                    </div>
                  </el-col>
                  <el-col :span="4">
                    <div class="grid-content groupli copylist">
                      <div>自定义抄送
                        <div class="copybtn fr" @click="cusClick">自定义</div>
                      </div>
                      <el-checkbox v-model="checkCustom" @change="nodeChange('customTree', 'Custom')" class="allchck">全选
                      </el-checkbox>
                      <el-tree :data="Custom" show-checkbox node-key="id" @check-change="treeChange('customTree')"
                               ref="customTree" highlight-current :props="defaultProps" accordion>
                      </el-tree>
                    </div>
                  </el-col>
                  <el-col :span="4">
                    <div class="grid-content groupli copylist">
                      <p>抄送人数共计{{copylistP.length}}人</p>
                      <ul v-for="(item,index) in copylistP" :key='index'>
                        <li>{{item.label}}</li>
                      </ul>
                    </div>
                  </el-col>
                </el-form-item>
              </el-row>
              <div class="button-action" style="text-align: center;">
                <el-button class="sure" @click="sendSubmit">派发</el-button>
                <el-button class="cancel" @click='resetSend'>取消</el-button>
              </div>
            </el-form>
          </div>
              <!--  创建自定义抄送组  -->
          <el-dialog title="" :visible.sync="dialogVisible" width="80%" append-to-body class="copyGroup">
            <span>
                <h2 class="titleblue">创建抄送组</h2>
                <div class="contant">
                    <el-form :model="ruleForm" ref="ruleForm" label-width="100px">
                        <el-row :gutter="24">
                            <el-form-item label="群组名称" prop="name" class="group-name">
                                <el-input v-model="ruleForm.name"></el-input>
                            </el-form-item>
                        </el-row>
                        <el-row :gutter="24">
                            <el-form-item label="添加群成员">
                              <x-tree title="抄送组" ref="outlan" :groupData.sync="groupData"
                                      :treeList2.sync="treeList2"></x-tree>
                            </el-form-item>
                        </el-row>
                        <el-row :gutter="24">
                            <el-form-item class="footerbtn">
                                <el-button type="primary" @click="copysure" class="sure">添加</el-button>
                                <el-button class="cancel" @click="copycancel">取消</el-button>
                            </el-form-item>
                        </el-row>
                    </el-form>
                </div>
            </span>
        </el-dialog>
      </span>
  </el-dialog>
</template>

<script>
  import XTree from '@/components/common/XTree.vue'
  import * as organizationService from '@/services/OrganizationService'
  import * as sysUserService from '@/services/SysUserService'
  import taskService from '@/services/TaskService.js'
  import msgGroupsService from '@/services/MsgGroupsService'

  export default {
    components: {
      'x-tree': XTree
    },
    data() {
      return {
        onekeydialog: false,
        ruleForm: {
          name: '',
        },
        treeList2: [],
        sendTask: {
          distribute: '',
          distributeSecond: '',
          unit: [{
            person: '',
            carrier: '',
            vehicle: '',
            tool: ''
          }],
        },
        data2: [],
        defaultProps: {
          children: 'children',
          label: 'label'
        },
        tableInfo: {},
        treeList: [],
        Zero: [],
        One: [],
        Two: [],
        Three: [],
        Custom: [],
        checkZero: false,
        checkOne: false,
        checkTwo: false,
        checkThree: false,
        checkCustom: false,
        copyArr: {
          zeroTree: [],
          oneTree: [],
          twoTree: [],
          threeTree: [],
          customTree: []
        },
        organization: [], // 组织机构
        sysUser: [], // 全部组织机构人员
        organizaAll: [],
        groupData: [],
        dialogVisible: false,
        defaultTree: []
      }
    },
    async created() {
      this.onekeydialog = true
      this.tableInfo = this.$route.params.data
      await this.getSelect()
      await this.getSendTree()
      await this.getCustom()
    },
    computed: {
      copylistP() {
        let arr = [], custom = this.copyArr.customTree
        arr.push(...this.copyArr.zeroTree)
        arr.push(...this.copyArr.oneTree)
        arr.push(...this.copyArr.twoTree)
        arr.push(...this.copyArr.threeTree)
        // arr.push(...this.copyArr.fourTree)
        // arr.push(...this.copyArr.fiveTree)
        // arr.push(...this.copyArr.sevenTree)
        for (let a = 0; a < custom.length; a++) {
          for (let b = 0; b < arr.length; b++) {
            if (custom[a].label == arr[b].label) {
              custom.splice(a, 1)
            }
          }
        }
        arr.push(...custom)
        return arr
      }
    },
    methods: {
      close1 () {
        this.onekeydialog = false
        this.$router.go(-1)
        // this.$router.push('/everyday-task')
      },
      copycancel() {
        this.dialogVisible = false
      },
      copysure() {
        if (this.ruleForm.name.length == 0) {
          this.$alert('请填写群组名称')
          return false
        }
        let arr = []
        arr = this.treeList2.map(item => {
          return {userId: item.id, userName: item.label}
        })
        let obj = {
          groupName: this.ruleForm.name,
          msgGroupUsers: arr
        }
        msgGroupsService.create(obj).then(res => {

          if (res) {
            this.$message({
              type: 'success',
              message: '创建成功'
            })
            this.dialogVisible = false
            this.getCustom()
          }
        })

      },
      getSelect() {
        organizationService.findAll().then(async res => {
          await res.data.sort((a, b) => {
            if (a.businessOrg < b.businessOrg) {
              return -1
            }
            if (a.businessOrg > b.businessOrg) {
              return 1
            }
            return 0
          })
          this.organization = res.data
          this.organizaAll = res.dataAll
        })
        sysUserService.findAll().then(res => {
          this.sysUser = res.data
          this.getSend()
          this.getSendTree()
        })
      },
      // 查询自定义抄送组
      getCustom() {
        msgGroupsService.search().then(res => {
          this.Custom = res.map(item => {
            let arr = []
            if (item.msgGroupUsers) {
              for (let key of item.msgGroupUsers) {
                arr.push({
                  id: key.userId,
                  label: key.userName
                })
              }
            }
            arr.sort((a, b) => {
              if (a.id < b.id) {
                return -1
              }
              if (a.id > b.id) {
                return 1
              }
              return 0
            })
            return {id: item.id, label: item.groupName, children: arr}
          })
        })
      },
      async getSend() {
        let obj = {zero: [], one: [], two: [], three: [], four: [], five: [], seven: [], custom: []}
        this.organizaAll.forEach(async item => {
          switch (item.businessOrg) {
            case 0:
              if (item.parentId) {
                  if (item.name.indexOf('处领导') < 0) {
                      obj.three.push({
                          id: item.id,
                          label: item.name,
                          children: []
                      })
                  }
              } else {
                obj.zero.push({
                  id: item.id,
                  label: item.name,
                  children: []
                })
              }
              break
            case 1:
              obj.one.push({
                id: item.id,
                label: item.name,
                children: []
              })
              break
            case 2:
              obj.two.push({
                id: item.id,
                label: item.name,
                children: []
              })
              break
            case 3:
                if (item.name.indexOf('处领导') < 0) {
                    obj.three.push({
                        id: item.id,
                        label: item.name,
                        children: []
                    })
                }
              break
            case 4:
              obj.four.push({
                id: item.id,
                label: item.name,
                children: []
              })
              break
            case 5:
              obj.five.push({
                id: item.id,
                label: item.name,
                children: []
              })
              break
            case 7:
              obj.seven.push({
                id: item.id,
                label: item.name,
                children: []
              })
              break
          }
        })
        for (let key in obj) {
          obj[key] = await obj[key].map(item => {
            let arr = this.sysUser.filter(ele => {
              if (ele.organiza) {
                return ele.organiza.id == item.id
              }
            })
            arr.sort((a, b) => {
                if (a.level < b.level) {
                    return 1
                } else {
                    return -1
                }
                return 0
            })
            item.children = arr.map(element => {
              return {id: element.id, label: element.fullname}
            })
            return item
          })
        }
        this.Zero = obj.zero
        this.One = obj.one
        this.Two = obj.two
          if (obj.three[0].id == 70) {
            let eightSea = obj.three[0]
              obj.three.splice(0, 1)
              obj.three.push(eightSea)
          }
        this.Three = obj.three
      },
      getSendTree() {
        let tree = []
        for (let item of this.organization) {
          if (this.$profile.organiza.businessOrg == 5 || (this.$profile.organiza.businessOrg == 0 && this.$profile.organiza.parendId == null) || this.$profile.organiza.businessOrg == 1) {
            if (item.businessOrg == 3 || item.businessOrg == 4 || item.businessOrg == 1) {
              let obj = {
                id: item.id,
                label: item.name,
                level: 1,
                businessOrg: item.businessOrg,
                children: []
              }

              if (item.sub) {
                for (let key of item.sub) {
                  let arr = []
                  arr = this.sysUser.filter(fil => {
                    if (fil.organiza) {
                      return fil.organiza.id == key.id
                    }
                  }).sort((a, b) => {
                      if (a.level < b.level) {
                          return 1
                      } else {
                          return -1
                      }
                      return 0
                  })
                  arr = arr.map(ma => {
                    return {
                      id: ma.id,
                      label: ma.fullname,
                      pId: ma.organiza.id,
                      pBusinessOrg: ma.organiza.businessOrg,
                      fId: item.id,
                      fBusinessOrg: item.businessOrg
                    }
                  })
                  obj.children.push({
                    id: key.id,
                    label: key.name,
                    businessOrg: key.businessOrg,
                    pId: item.id,
                    level: 2,
                    children: arr
                  })
                }
              } else {
                // for (let key of item.sub) {
                let arr = []
                arr = this.sysUser.filter(fil => {
                  if (fil.organiza) {
                    return fil.organiza.id == item.id
                  }
                }).sort((a, b) => {
                    if (a.level < b.level) {
                        return 1
                    } else {
                        return -1
                    }
                    return 0
                })
                arr = arr.map(ma => {
                  return {
                    id: ma.id,
                    label: ma.fullname,
                    pId: ma.organiza.id,
                    pBusinessOrg: ma.organiza.businessOrg,
                    fId: item.id,
                    fBusinessOrg: item.businessOrg
                  }
                })
                obj.children = arr
                // }
              }

              tree.push(obj)
            }
          } else if (this.$profile.organiza.businessOrg == 3) {
            if (this.$profile.organiza.id == item.id) {
              let obj = {
                id: item.id,
                label: item.name,
                level: 1,
                businessOrg: item.businessOrg,
                children: []
              }
              if (item.sub) {
                for (let key of item.sub) {
                  let arr = []
                  arr = this.sysUser.filter(fil => {
                    if (fil.organiza) {
                      return fil.organiza.id == key.id
                    }
                  }).sort((a, b) => {
                      if (a.level < b.level) {
                          return 1
                      } else {
                          return -1
                      }
                      return 0
                  })
                  arr = arr.map(ma => {
                    return {
                      id: ma.id,
                      label: ma.fullname,
                      pId: ma.organiza.id,
                      pBusinessOrg: ma.organiza.businessOrg,
                      fId: item.id,
                      fBusinessOrg: item.businessOrg
                    }
                  })
                  obj.children.push({
                    id: key.id,
                    label: key.name,
                    businessOrg: key.businessOrg,
                    pId: item.id,
                    level: 2,
                    children: arr
                  })
                }
              }
              tree.push(obj)
            }
          } else if (this.$profile.level == 1) {
              if (this.$profile.organiza.parentId == item.id) {
                  let obj = {
                      id: item.id,
                      label: item.name,
                      level: 1,
                      businessOrg: item.businessOrg,
                      children: []
                  }
                  if (item.sub) {
                      for (let key of item.sub) {
                          let arr = []
                          arr = this.sysUser.filter(fil => {
                              if (fil.organiza) {
                                  return fil.organiza.id == key.id
                              }
                          }).sort((a, b) => {
                              if (a.level < b.level) {
                                  return 1
                              } else {
                                  return -1
                              }
                              return 0
                          })
                          arr = arr.map(ma => {
                              return {
                                  id: ma.id,
                                  label: ma.fullname,
                                  pId: ma.organiza.id,
                                  pBusinessOrg: ma.organiza.businessOrg,
                                  fId: item.id,
                                  fBusinessOrg: item.businessOrg
                              }
                          })
                          obj.children.push({
                              id: key.id,
                              label: key.name,
                              businessOrg: key.businessOrg,
                              pId: item.id,
                              level: 2,
                              children: arr
                          })
                      }
                  }
                  tree.push(obj)
              }
          } else if (this.$profile.olevel == 2) {
            if (this.$profile.organiza.parentId == item.id) {
              if (item.sub) {
                for (let key of item.sub) {
                  let arr = []
                  if (key.id == this.$profile.organiza.id) {
                    arr = this.sysUser.filter(fil => {
                      if (fil.organiza) {
                        return fil.organiza.id == key.id
                      }
                    })
                    arr.sort((a, b) => {
                      if (a.id < b.id) {
                        return -1
                      } else {
                        return 1
                      }
                      return 0
                    })
                    arr = arr.map(ma => {
                      tree.push({
                        id: ma.id,
                        label: ma.fullname,
                        pId: ma.organiza.id,
                        pBusinessOrg: ma.organiza.businessOrg,
                        fId: item.id,
                        fBusinessOrg: item.businessOrg
                      })
                    })

                  }
                }
              }

            }
          }

        }
        tree.sort((a, b) => {
          if (a.id < b.id) {
            return -1
          } else {
            return 1
          }
          return 0
        })
        this.data2 = tree
        this.groupData = tree
          if (this.tableInfo.taskUsers) {
              if (this.tableInfo.taskUsers.length > 0) {
                  this.tableInfo.taskUsers.forEach((tuItem, index) => {
                      this.defaultTree.push(tuItem.userId)
                      this.data2.forEach(item => {
                          if (item.id == tuItem.userId) {
                              this.handleCheckChange(item)
                          } else {
                              if (item.children) {
                                  item.children.forEach(itCh => {
                                      if (itCh.id == tuItem.userId) {
                                          this.handleCheckChange(itCh)
                                      } else {
                                          if (itCh.children) {
                                              itCh.children.forEach(itChCh => {
                                                  if (itChCh.id == tuItem.userId) {
                                                      this.handleCheckChange(itChCh)
                                                  }
                                              })
                                          }
                                      }
                                  })
                              }
                          }
                      })
                  })
              }
          }
      },
      async handleCheckChange(data, checked, indeterminate) {
          if (checked) {
              if (this.$profile.olevel > data.level) {
                  this.$alert('不可以派发给上级', '提示')
                  let arr = this.treeList.map(item => {
                      return item.id
                  })
                  this.$refs.tree.setCheckedKeys(arr)
                  return false
              }
          }
        let obj = {}
        let num = await this.treeList.findIndex(item => {
          return item.id == data.id
        })
        if (num == -1) {
          if (data.level) {
            obj = {name: data.label, id: data.id, pId: data.pId, businessOrg: data.businessOrg, level: data.level}
          } else {
            obj = {
              name: data.label,
              id: data.id,
              pId: data.pId,
              pBusinessOrg: data.pBusinessOrg,
              level: data.level,
              fBusinessOrg: data.fBusinessOrg,
              fId: data.fId
            }
          }
          this.treeList.push(obj)
        } else {
          this.treeList.splice(num, 1)
        }
      },
      //自定义抄送
      cusClick() {
        this.dialogVisible = true
      },
      treeChange(ele) {
        this.$refs[ele].getCheckedNodes()
        this.copyArr[ele] = this.$refs[ele].getCheckedNodes().filter(item => {
          return !item.children
        })
      },
      nodeChange(ele, name) {
        if (this[`check${name}`]) {
          //全选
          this.$refs[ele].setCheckedNodes(this[name])
        } else {
          //取消选中
          this.$refs[ele].setCheckedKeys([])
        }
      },
      //任务派发提交
      sendSubmit() {
        if (this.treeList.length == 0) {
          this.$message({
            type: 'warning',
            message: '请选择派发部门'
          })
          return false
        }

        let taskTypeFlows = [], distUnit = [], org = {}, idFlag = '', useList = [], fId = '', pBus = ''
        for (let item of this.treeList) {
          if (!item.level) {
            if (idFlag == '') {
              idFlag = item.pId
              pBus = item.pBusinessOrg
              fId = item.fId
              useList.push({id: item.id})
            } else {
              if (idFlag != item.pId) {
                this.$message({
                  type: 'warning',
                  message: '一个任务只能选择派发给一个部门, 请重新选择'
                })
                idFlag = ''
                fId = ''
                useList = []
                return false
              } else {
                useList.push({id: item.id})
                pBus = item.pBusinessOrg
              }
            }
          }
        }
        for (let item of this.treeList) {
          if (item.level) {
            if (idFlag != '' && fId != '') {
              if (item.id != idFlag) {
                if (item.id != fId) {
                  this.$message({
                    type: 'warning',
                    message: '一个任务只能选择派发给一个部门, 请重新选择'
                  })
                  idFlag = ''
                  fId = ''
                  org = {}
                  return false
                } else {
                  org = {id: item.id, businessOrg: item.businessOrg, sysUsers: []}
                }
              } else {
                org = {id: item.id, businessOrg: item.businessOrg, sysUsers: []}
              }
            } else {
              idFlag = item.id
              fId = item.id
              org = {id: item.id, businessOrg: item.businessOrg, sysUsers: []}
            }
          }
        }
        if (useList) {
          if (!org.id) {
            org = {
              id: idFlag,
              businessOrg: pBus,
              sysUsers: useList
            }
          } else {
            org.sysUsers = useList
          }
        }
        if (this.tableInfo.taskTypeFlows) {
          taskTypeFlows = this.tableInfo.taskTypeFlows.map(item => {
            return {type1: item.type1, type2: item.type2, type3: item.type3}
          })
        }
        let obj = JSON.parse(JSON.stringify(this.tableInfo))
        obj.taskTypeFlows = taskTypeFlows ? taskTypeFlows : [{
          type1: this.tableInfo.type1,
          type2: this.tableInfo.type2,
          type3: this.tableInfo.type3
        }]
        obj.organiza = org
        obj.taskSource = 1
        obj.userIds = this.copylistP ? this.copylistP.map(item => {
          return item.id
        }) : []
          const loading = this.$loading({
              lock: true,
              text: 'Loading',
              spinner: 'el-icon-loading',
              background: 'rgba(0, 0, 0, 0.7)'
          })
        taskService.update(obj, 1).then(res => {
          if (res) {
            this.$emit('close')
            this.$message({
              type: 'success',
              message: '派发成功'
            })
          } else {
              this.$emit('close')
              this.$message({
                  type: 'error',
                  message: '派发失败'
              })
          }
            loading.close()
        })
      },
      // 重置派发的选择选项
      resetSend() {
        for (let key in this.copyArr) {
          this.$refs[key].setCheckedKeys([])
        }
        this.$refs.tree.setCheckedKeys([])
        this.treeList = []
        this.checkZero = false
        this.checkOne = false
        this.checkTwo = false
        this.checkThree = false
        this.checkCustom = false
        // close
        this.sendDialog = false
      },
    }
  }
</script>

<style lang="scss">
  .refine_hscdaytask {
  }

  .plan-operate {
    .create {
      margin-bottom: 22px;
    }
  }

  .task-content {
    .blue-button {
      width: 126px;
      margin-left: 20px;
    }

    .unit-wrap {
      margin-bottom: 10px;

      .w33 {
        width: 22.3%;
        float: left;
        margin: 0 1%;
      }

      .w33:first-child {
        margin-left: 0;
      }

      i {
        float: left;
        line-height: 40px;
        font-size: 20px;
        cursor: pointer;
      }
    }

    .el-upload__tip {
      width: 300px;
      height: 40px;
      border-radius: 2px;
      border: solid 1px #dddddd;
      float: left;
      margin-top: 0;
      padding: 0 15px;
      font-size: 14px;
      color: #b9b9b9;
      text-align: left;
    }

    .el-upload--text {
      float: right;
      width: 58px;
      height: 40px;
      border: none;
      border-radius: 2px;
      margin-left: 5px;
    }

    .el-upload--text button {
      background-color: #0062cd;
      border-radius: 2px;
      border: none;
      padding: 0;
      width: 58px;
      height: 40px;
      text-align: center;
      margin-left: 0px !important;
    }

    .button-action {
      padding-bottom: 30px;
    }

    .el-form img {
      width: 62px;
      height: 64px;
      background-color: #f5f5f5;
      border-radius: 2px;
      border: solid 1px #dddddd;
      float: left;
      margin-right: 10px;
    }

    .checkgroup {
      .el-checkbox {
        padding: 0;
        float: left;
        margin-left: 0px;
      }

      .el-checkbox__input {
        display: inline-block;
      }

      .el-checkbox__label {
        display: inline-block;
        max-width: 90%;
        vertical-align: -4px;
        overflow: hidden;
        text-overflow: ellipsis;
        padding-left: 5px;
      }

      .el-form-item__content {
        width: 90%;
        box-sizing: border-box;
      }


    }

    .groupli {
      border: 1px solid #ddd;
      height: 400px;
      // margin-right:10px;
      padding: 0px 4px;

      P {
        font-size: 14px;
        line-height: 30px;
      }

      li {
        line-height: 30px;
        border-bottom: 1px solid #ddd;
      }

      .el-tree-node__content > .el-tree-node__expand-icon {
        padding: 0px;
      }

      .el-tree-node {
        width: 100%;
        float: left;
        display: inline-table;
      }

    }

    .el-col-4:first-child {
      padding-left: 0px !important
    }

    .copylist {
      overflow-y: auto
    }

    .task-tree {
      border: 1px solid #ddd;
      padding: 10px 0px;
      height: 300px;
      overflow-y: auto;

      label {
        width: auto !important;

      }

      .el-checkbox {
        width: auto !important;
        height: auto;
      }
    }

    .tree-cont {
      border: 1px solid #ddd;
      padding: 10px;
      box-sizing: border-box;
      min-height: 300px;
      overflow-y: auto;

      .el-input {
        width: 60px;
        height: 30px;
        margin-left: 5px;

        input {
          height: 30px;
          text-align: center;
        }
      }
    }

    .copybtn {
      width: 50px;
      height: 20px;
      background-color: #0062cd;
      border-radius: 4px;
      font-size: 12px;
      color: #ffffff;
      text-align: center;
      line-height: 20px;
      cursor: pointer;
      margin-top: 10px;
      margin-right: 2px;
    }

    .el-tree__empty-block {
      margin-top: 30px;
    }

  }
</style>
